@extends('admin.base.web', ['title' => '主页'])
@section('content')
<style>
    .el-aside {
        min-height: 100vh;
        background-color: gray
    }
</style>
<div id="app">
    <el-container>
        <el-container>
            <el-main>
                <el-button type="primary" @click="ktHenDialog = true"  icon="el-icon-plus">空投母鸡卡</el-button>



                {{-- 空投母鸡卡 --}}
                <el-dialog title="空投母鸡卡" :visible.sync="ktHenDialog" width="60%">
                    <el-form :model="form" label-position="right" size="mini" label-width="180px">
                        <el-form-item label="空投对象">
                            <el-input v-model="form.consumer"></el-input>
                        </el-form-item>
                        <el-form-item label="绿卡1">
                            <el-input v-model="form.green_card_1"></el-input>
                        </el-form-item>
                        <el-form-item label="绿卡2">
                            <el-input v-model="form.green_card_2"></el-input>
                        </el-form-item>
                        <el-form-item label="绿卡3">
                            <el-input v-model="form.green_card_3"></el-input>
                        </el-form-item>
                        <el-form-item label="绿卡4">
                            <el-input v-model="form.green_card_4"></el-input>
                        </el-form-item>
                        <el-form-item label="绿卡5">
                            <el-input v-model="form.green_card_5"></el-input>
                        </el-form-item>
                        <el-form-item label="蓝卡1">
                            <el-input v-model="form.blue_card_1"></el-input>
                        </el-form-item>
                        <el-form-item label="蓝卡2">
                            <el-input v-model="form.blue_card_2"></el-input>
                        </el-form-item>
                        <el-form-item label="红卡1">
                            <el-input v-model="form.red_card_1"></el-input>
                        </el-form-item>
                        <el-form-item label="黑卡1">
                            <el-input v-model="form.black_card_1"></el-input>
                        </el-form-item>
                        <el-form-item label="随机">
                            <el-input v-model="form.randomization"></el-input>
                        </el-form-item>
                    </el-form>
                    <div slot="footer" class="dialog-footer">
                        <el-button @click="ktHenDialog = false">关闭</el-button>
                        <el-button @click="addClick('form')" type="success">确认</el-button>
                    </div>
                </el-dialog>
            </el-main>
        </el-container>
    </el-container>

</div>
@endsection
@section('script')
<script>
    // 初始化 Vue 实例
        new Vue({
            el: '#app',
            data() {
                return {
                    ktHenDialog:false,
                    form: {
                        id: "",
                        issuer:"",
                        consumer:"",
                        green_card_1: "0",
                        green_card_2: "0",
                        green_card_3: "0",
                        green_card_4: "0",
                        green_card_5: "0",
                        blue_card_1: "0",
                        blue_card_2: "0",
                        gold_card_1: "0",
                        red_card_1: "0",
                        black_card_1: "0",
                        randomization: "0"
                    },
                };
            },
            computed: {},
            watch: {},
            created() {
            },
            mounted() {},
            destroyed() {},
            methods: {
                addClick(){
                    axios.post("{{ route('admin.manual.cards.add') }}", this.form).then(res => {
                        console.log(res.data)
                        if (res.data.code == 2) {
                            this.$message({
                                message: '添加成功!',
                                type: 'success'
                            });
                            this.dialogFormVisible = false

                        } else {
                            this.$message({
                                message: '添加失败',
                                type: 'warning'
                            });
                        }
                    })
                }
            },
        });
</script>
@endsection